<template>
    <div>
        <el-card class="box-card" shadow="never">
            <div slot="header" class="clearfix">
                <span class="card-title">{{ title }}</span>
                <el-button style="float: right" size="mini" type="primary"
                    @click="() => handleSave(false)">保存</el-button>
                <el-button style="float: right; margin-right: 10px" size="mini" v-if="!this.id"
                    @click="() => handleSave(true)">保存并新增</el-button>
            </div>
            <div class="text item">
                <el-form :model="numberRule" :rules="rules" ref="numberRuleForm" label-width="100px"
                    label-position="left">
                    <el-form-item label="类型" prop="type">
                        <type-select v-model="numberRule.type" :disabled="!!id"></type-select>
                    </el-form-item>
                    <el-form-item label="名称" prop="name">
                        <el-input v-model="numberRule.name"></el-input>
                    </el-form-item>
                    <el-form-item label="前缀" prop="prefix">
                        <el-input v-model="numberRule.prefix"></el-input>
                    </el-form-item>
                    <el-form-item label="流水长度" prop="flowLength">
                        <number-input v-model="numberRule.flowLength"> </number-input>
                    </el-form-item>
                    <el-form-item label="是否默认" prop="isDefault">
                        <el-switch v-model="numberRule.isDefault"> </el-switch>
                    </el-form-item>
                </el-form>
            </div>
        </el-card>
    </div>
</template>
<script>
import { getNumberRule, addNumberRule, updateNumberRule } from "@/api/numberRule";
import typeSelect from "@/components/Select/documentTypeSelect.vue"
import numberInput from "@/components/Input/numberInput.vue";
export default {
    components: {
        typeSelect,
        numberInput
    },
    data() {
        return {
            numberRule: { id: null, name: null, type: null, prefix: null, flowLength: null },
            rules: {
                type: [{ required: true, message: "请选择单据类型", trigger: "blur" }],
                name: [{ required: true, message: "请填写名称", trigger: "blur" }],
                prefix: [{ required: true, message: "请填写前缀", trigger: "blur" }],
                flowLength: [{ required: true, message: "请填写流水长度", trigger: "blur" }],
            },
            title: "",
        };
    },
    methods: {
        getData() {
            if (!this.id) return;
            getNumberRule(this.id).then((res) => {
                this.numberRule = res || {};
            });
        },
        handleSave(afterAdd) {
            this.$refs.numberRuleForm.validate((valid) => {
                if (valid) {
                    this.saveData(afterAdd);
                } else {
                    console.log("error submit!!");
                    return false;
                }
            });
        },
        saveData(afterAdd) {
            if (!this.id) {
                addNumberRule(this.numberRule).then((res) => {
                    if (!res) return;
                    this.$notify({
                        title: "成功",
                        message: "保存成功",
                        type: "success",
                        position: "bottom-right",
                    });
                    if (afterAdd) {
                        this.numberRule = {};
                    } else {
                        this.$emit("refresh", res);
                    }
                });
            } else {
                updateNumberRule(this.numberRule).then((res) => {
                    if (!res) return;
                    this.$notify({
                        title: "成功",
                        message: "保存成功",
                        type: "success",
                        position: "bottom-right",
                    });
                    if (afterAdd) {
                        this.numberRule = {};
                    } else {
                        this.$emit("refresh", res);
                    }
                });
            }
        },
    },
    mounted() {
        this.title = this.id ? "编辑" : "新增";
        this.getData();
    },
    props: {
        id: {
            type: String,
            default: "",
        },
    },
};
</script>
<style scoped></style>